<template>
  <div class="hello">
  <template v-if="list.length">
    <table>
      <thead>
      <tr>
        <th></th>
        <th>商品名称</th>
        <th>商品单价</th>
        <th>商品数量</th>
        <th>操作</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="(item,index) in list">
<td>{{index + 1}}</td>
<td>{{item.name}}</td>
<td>{{index.price}}</td>
<td>
<button @click="handleReduce(index)"></button>
<button></button>
</td>
        </tr>
      </tbody>
      </table>
    
    <template>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
     list:[
     {
       
     }
     
     ]
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
